* {
    margin: 0;
    padding: 0;
}

li {
    list-style-type: none;
}

/* -------------- */
.container {
    margin: 100px auto;
    width: 400px;
    /* height: 600px; */
    background-image: linear-gradient(to bottom right, #65d4f2, #5882f0);
    border-radius: 15px;
    overflow: hidden;
    /* overflow: auto; */
}

/*------------- 搜索部分 -----------------*/
.search {
    text-align: center;
    margin: 10px 0;
}

.search input {
    width: 250px;
    height: 25px;
    border: 1px solid white;
    border-radius: 20px;
}

.search button {
    width: 50px;
    height: 25px;
    border-radius: 20px;
    border: 1px solid white;
    color: white;
    font-weight: 700;
    background-image: linear-gradient(to bottom right, #65d4f2, #5368ee);
}

/* - -------------- 切换栏 ------------ */
.head {
    width: 100%;
    height: 40px;
    overflow: hidden;
}

.head li {
    box-sizing: border-box;
    float: left;
    width: 60px;
    height: 40px;
    margin-left: 5px;
    line-height: 40px;
    text-align: center;
    border-radius: 15px;
    background-color: white;
}

.current {
    color: #000;
    border: 2px solid #5368ee;
}

/* -----------------  天气  ------------------ */
.content {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.content .weather {
    width: 100%;
    margin-bottom: 30px;
    border-radius: 15px;
    color: white;
    background-color: #5368ee;

}

.content .weather span {
    display: block;
    margin-bottom: 5px;
    margin-left: 20px;
}